<template>
  <van-nav-bar
    title="个人资料"
    right-text="保存"
    left-arrow
    @click-left="onClickLeft"
    @click-right="onClickRight"
  />
  <div class="input">
    <van-form @submit="onSubmit">
      <van-cell title="头像，、" is-link>
        <!-- 使用 right-icon 插槽来自定义右侧图标 -->
        <template #right-icon>
          <van-icon name="search" class="search-icon" />
        </template>
      </van-cell>
      <van-cell-group inset>
        <van-field
          v-model="username"
          label="昵称"
          placeholder="请输入您的昵称"
          input-align="right"
        />
      </van-cell-group>
      <van-cell title="性别" is-link value="女" />
      <van-cell-group inset>
        <van-field
          v-model="value"
          label="电话号码"
          placeholder="请输入您的电话号码"
          input-align="right"
        />
      </van-cell-group>
      <van-cell-group inset>
        <van-field
          v-model="password"
          label="个性签名"
          placeholder="请输入您的个性签名"
          input-align="right"
        />
      </van-cell-group>
      <!-- <div style="margin: 16px">
      <van-button
        round
        to="/my"
        block
        type="primary"
        @click="aaa"
        native-type="submit"
      >
        提交
      </van-button>
    </div> -->
    </van-form>
  </div>
</template>
<script setup>
import { ref } from "vue";
import userUserStore from "@/stores/user";
const { saveNa, saveNick } = userUserStore();
import { showToast } from "vant";

import { useRouter } from "vue-router";
const router = useRouter();

const username = ref("");
const password = ref("");
const onSubmit = (values) => {
  console.log("submit", values);
};
function onClickRight() {
  let cctv = username.value;
  let nickname = password.value;
  if (cctv && nickname != "") {
    localStorage.setItem("names", cctv);
    localStorage.setItem("nickname", nickname);
    saveNa(cctv);
    saveNick(nickname);
    console.log(cctv);
    router.push({
      name: "my",
    });
  } else {
    showToast("请填写完整");
  }
}
const onClickLeft = () => history.back();
// const onClickRight = () => showToast("按钮");
</script>
<style>
.van-cell-group--inset {
  margin: 0;
}
</style>
